//@ts-ignore
import { configureStore } from "@reduxjs/toolkit";
import apiService from "@service/index";
import credentialsReducer from '@store/slice/credentials'
import persistUserReducer from "@slice/user";
//@ts-ignore
import { useDispatch, TypedUseSelectorHook, useSelector } from "react-redux";
import persistGuestChannelReducer from '@slice/guestChannel'
import newsReducer from '@slice/credentials'
import persistSearchKeyReducer from '@slice/comment'
import searchReducer from '@slice/comment'
// slice 切片 : 1/initialState  2/同步操作  3/异步操作 createAsyncThunk + 手动axios
// 国外：全局的API状态切片: 1/不用手动配置axios 2/ 内置：取消请求 缓存 等高级操作
const store = configureStore({
    devTools: process.env.NODE_ENV === "development", // 先下开启 线上不开启
    reducer: {
        [apiService.reducerPath]: apiService.reducer,
        credentialsReducer,
        userReducer: persistUserReducer,
        guestChannelReducer: persistGuestChannelReducer,
        newsReducer:newsReducer,
        searchKeyReducer: persistSearchKeyReducer,
        searchReducer:searchReducer,
    },
    //@ts-ignore
    middleware: (getDefaultMiddleware) => {
        // 加入全局API切片的中间件 开启内置：取消请求 缓存 等高级操作 
        return getDefaultMiddleware({ serializableCheck: false }).concat(apiService.middleware);
    }
});


export type AppDispatch = typeof store.dispatch;
export const useTypedDispatch = () => useDispatch<AppDispatch>();

export type AppState = ReturnType<typeof store.getState>;
export const useTypedSelector: TypedUseSelectorHook<any> = useSelector;

export default store;
